<template>
  <view class="wrapper">
    <view class="time">
      <view class="project">
        <text>注册时间：{{registrationTime}} </text>
      </view>
      <view class="project">
        <text>到期时间：{{expirationTime}} </text>
      </view>
      <view class="project">
        <text>已缴端口费： {{money}}</text>
      </view>
    </view>


    <u-form ref="form" :rules="rules" :model="form">
      <p class="project">注销身份说明： <span style="margin-left:10rpx;margin-top: 10rpx;"></span></p>
      <u-form-item prop="intro">
        <u-input class="field-input" v-model="form.intro" :border-bottom="false" type="textarea"
          placeholder="请输入注销身份说明" />
      </u-form-item>
    </u-form>


    <view class="submit" @click="editPassword">申请</view>
  </view>
</template>
<script>
  import storage from "@/utils/storage.js"
  import {
    cancellation,
    cancellationButton
  } from "@/api/members.js";
  export default {
    data() {
      return {
        userInfo: {},
        cancel: {},
        registrationTime: "",
        expirationTime: "",
        money: null,
        form: {
          intro: ''
        },
        rules: {
          intro: [{
            required: true,
            message: '请填写说明'
          }]
        }
      }
    },
    onShow() {
      this.userInfo = storage.getUserInfo()
      this.showPage()
    },
    methods: {
      showPage() {
        cancellation().then((res) => {
          if (res.data.success) {
            this.registrationTime = res.data.result.registerTime
            this.expirationTime = res.data.result.expireTime
            this.money = res.data.result.hasPayPortFee
          } else {
            uni.showToast({
              title: "获取数据失败!",
              duration: 2000,
              icon: "none",
            });
          }
        })
      },
      editPassword() {
        this.$refs.form.validate(valid => {
          if (valid) {
            cancellationButton({
              revokeMsg: this.form.intro,
            }).then((res) => {
              let introText = this.form.intro
              if (res.data.success) {
                uni.showToast({
                  title: "提交成功!",
                  duration: 2000,
                  icon: "none",
                });
                uni.redirectTo({
                  url: './schedule?introText=' + introText
                })
              } else {
                uni.showToast({
                  title: "申请失败!",
                  duration: 2000,
                  icon: "none",
                });
              }
            })
          } else {
            uni.showToast({
              title: "请填写说明",
              duration: 2000,
              icon: "none",
            });
          }
        });
      },
      onReady() {
        this.$refs.form.setRules(this.rules);
      }
    }
  }
</script>

<style>
  .project {
    padding-left: 30rpx;
    padding-top: 22rpx;
  }

  .feedBack-box {
    background: #fff;
    margin-top: 20rpx;
    border-radius: 16rpx;
    width: 686rpx;
    height: 330rpx;
  }

  .u-input {
    margin: 20rpx;
    background: #fff;
  }

  .submit {
    position: fixed;
    left: 226rpx;
    bottom: 34rpx;
    width: 298rpx;
    height: 76rpx;
    background: linear-gradient(162.65deg, rgba(0, 162, 255, 1) 0%, rgba(22, 111, 219, 0.65) 100%);
    border-radius: 46rpx;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    line-height: 76rpx;
  }
</style>
